<template>
  <div id="companyData">
    <dv-border-box1 ref="borderRef">
      <el-row :gutter="20">
        <el-col :span="8">
          <dv-border-box2 style="height: 100%;width: 100%;">
            <dv-decoration-11 style="width:100%;height:60px; padding-top: 10px;">
              <div style="font-size: 20px; color: white;text-align: center;
            line-height: 60px;">最受欢迎的公司</div>
            </dv-decoration-11>
            <Welcompany :datalist="dataList"></Welcompany>
          </dv-border-box2>
        </el-col>
        <el-col :span="8">
          <dv-border-box2 style="height: 100%;width: 100%;">
            <dv-decoration-11 style="width:100%;height:60px; padding-top: 10px;">
              <div style="font-size: 20px; color: white;text-align: center;
            line-height: 60px;">薪资较高的公司</div>
            </dv-decoration-11>
            <RichCompany :datalist="dataList"></RichCompany>
          </dv-border-box2>
        </el-col>
        <el-col :span="8">
          <dv-border-box2 style="height: 100%;width: 100%;">
            <dv-decoration-11 style="width:100%;height:60px; padding-top: 10px;">
              <div style="font-size: 20px; color: white;text-align: center;
            line-height: 60px;">最近入职的公司</div>
            </dv-decoration-11>
            <EntryCompany :datalist="dataList"></EntryCompany>
          </dv-border-box2>
        </el-col>
      </el-row>
    </dv-border-box1>
  </div>
</template>
<script setup>
import axios from 'axios';
import {onMounted,ref} from 'vue'
import EntryCompany from '../../components/company/EntryCompany.vue';
import Welcompany from '../../components/company/Welcompany.vue'
import RichCompany from '../../components/company/RichCompany.vue';
const dataList = ref([])
onMounted(()=>{
  getDataList()
})
const getDataList = async () => {
  const res = await axios.get("/admin/companystudents")
  dataList.value = res.data
  console.log(res.data);
}
</script>
<style scoped lang='scss'>
#companyData {
  background: url('../../assets/bbb.jpg') no-repeat center;
  background-size: 100% 100%;
  height: 800px;
  padding: 10px;
  border-radius: 30px;

  .el-row {
    padding: 10px;
    height: 800px;
    color: white;
  }
}
</style>